<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<link rel="stylesheet" href="css/style.css">
	<link rel="stylesheet" href="css/common.css">
	<script src="js/jquery-1.8.3.js"></script>
	<title>和记租车</title>
</head>
<body>
<div class="box">
	<div class="line"></div>
	<div class="top gWidth clearfix">
		<div class="logo"><img src="images/logo.png" alt=""></div>
		<div class="right clearfix">
			<ul class="list">
				<li class="l1"><a href="">登录</a><span>|</span></li>
				<li><a href="">免费注册</a><span>|</span></li>
				<li><a href="">关于和记</a><span>|</span></li>
				<li><a href="">帮助中心</a></li>
				<li class="qq"><img src="images/tu1.png" alt=""></li>
			</ul>
			<div class="t_btm">0532-83781666/888</div>
		</div>
	</div>
	<div class="bj">
		<ul class="nav gWidth clearfix">
				<li class="active"><a href="">网站首页</a></li>
				<li><a href="">企业包车</a></li>
				<li><a href="">商务用车</a></li>
				<li><a href="">婚庆用车</a></li>
				<li><a href="">代驾租车</a></li>
				<li><a href="">自驾租车</a></li>
				<li><a href="">旅游用车</a></li>
				<li><a href="">车型查询</a></li>
				<li><a href="">特惠活动</a></li>
		</ul>
	</div>
	<div class="banner">
		<img src="images/banner.png" alt="">
	</div>
	<div class="content1 gWidth clearfix">
		<div class="left clearfix">
			<div class="l_top clearfix">
				<h4>热门车型</h4>
				<p><a href="">更多+</a></p>
			</div>
			<div class="line1"></div>
			<div class="l_cen clearfix">
				<div class="che">
					<div class="new"><img src="images/tu3.png" alt=""></div>
				</div>
				<div class="che">
					<div class="new"><img src="images/tu3.png" alt=""></div>
				</div>
				<div class="che">
					<div class="new"><img src="images/tu3.png" alt=""></div>
				</div>
			</div>
		</div>
		<div class="right clearfix">
			<div class="r_top clearfix">
				<h4>特色服务</h4>
				<p><a href="">更多+</a></p>
			</div>
			<div class="line2"></div>
			<div class="r_cen clearfix">
				<p class="p1 clearfix"><span class="s1">代价</span><span class="s2">婚车服务</span><span class="s3">会议服务</span></p>
				<p class="p2 clearfix"><span class="s4">接机</span><span class="s5">送机</span><span class="s6">企业包车</span></p>
			</div>
		</div>
	</div>
	<div class="content2 gWidth clearfix">
		<div class="k1">
			<div class="p1"><p>1</p></div>
			<div class="text">
				<p class="p2">制定行程</p>
				<p class="p3">选择取车还车门店及时间</p>
			</div>
		</div>
		<div class="k2 clearfix">
			<div class="p1"><p>2</p></div>
			<div class="text">
				<p class="p2">选择车型</p>
				<p class="p3">多款车型供您挑选</p>
			</div>
			
		</div>
		<div class="k3">
			<div class="p1"><p>3</p></div>
			<div class="text">
				<p class="p2">提交订单</p>
				<p class="p3">轻松下单,开始旅行</p>
			</div>
		</div>
	</div>
	<div class="content3 gWidth clearfix">
		<div class="left clearfix">
			<div class="l_top clearfix">
				<h4>特惠活动</h4>
				<p><a href="">更多+</a></p>
			</div>
			<div class="line1"></div>
			<div class="l_cen clearfix">
				<div class="l_cen_l clearfix">
					<img src="images/tu5.png" alt="">
					<p><a href="">会员专享特权</a></p>
				</div>
				<div class="l_cen_r clearfix">
					<ul class="clearfix">
						<li>
							<img src="images/tu6.png" alt="">
							<p><a href="">国庆节租六赠一</a></p>
						</li>
						<li>
							<img src="images/tu7.png" alt="">
							<p><a href="">中秋节租二赠一</a></p>
						</li>
						<li>
							<img src="images/tu8.png" alt="">
							<p><a href="">端午节租六赠一</a></p>
						</li>
						<li>
							<img src="images/tu9.png" alt="">
							<p><a href="">清明节租六赠一</a></p>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div class="right">
			<div class="r_top clearfix">
				<h4>租车常识</h4>
				<p><a href="">更多+</a></p>
			</div>
			<div class="line2"></div>
			<div class="r_cen">
				<ul>
					<li>青岛租车需要的手续有哪些?</li>
					<li>租车过程中车辆出现故障如何处理?</li>
					<li>提前还车，怎么办?</li>
					<li>长期租车会员有什么优惠?</li>
					<li>和记租车有代驾么?</li>
					<li>外地人租车需要准备什么?</li>
					<li>外地人租车需要准备什么?</li>
					<li>和记租车有代驾么?</li>
				</ul>
			</div>
		</div>
	</div>
	<div class="content4 gWidth">
		<h4>热点链接</h4>
		<div class="line1"></div>
		<ul class="list clearfix">
			<li><a href="">增值服务</a><span>|</span></li>
			<li><a href="">网站地图</a><span>|</span></li>
			<li><a href="">和记微博</a><span>|</span></li>
			<li><a href="">和记博客</a></li>
		</ul>
	</div>
	<div class="b_bj">
		<div class="bottom gWidth">
			<div class="b_top">
				<ul class="list clearfix">
					<li>
						<p>关于和记</p>
						<ul>
							<li>公司简介</li>
							<li>企业文化</li>
							<li>企业荣誉</li>
						</ul>
					</li>
					<li>
						<p>新手上路</p>
						<ul>
							<li>如何注册用户</li>
							<li>预订演示</li>
							<li>取消及修改订</li>
						</ul>
					</li>
					<li>
						<p>售后服务</p>
						<ul>
							<li>建议专区</li>
							<li>客户投诉</li>
						</ul>
					</li>
					<li>
						<p>会员服务</p>
						<ul>
							<li>忘记密码</li>
							<li>积分说明</li>
						</ul>
					</li>
					<li>
						<p>联系我们</p>
						<ul>
							<li>地址:青岛市宁夏路89号210室K五星电器院内</li>
							<li>电话: 0532-83781666 83781888</li>
							<li>手机: 15605320788</li>
						</ul>
					</li>
				</ul>
				<div class="erweima"><img src="images/tu11.png" alt=""></div>
			</div>
			<div class="b_cen">
				<p class="p1">Cpyright &reg; 2014-2015青岛和记汽车服务有限公司版权所有&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;鲁ICP备14005716号</p>
				<p class="p2">版权声明<span>|</span>站长统计</p>
			</div>
			<div class="b_btm">
				<ul>
					<li><a href="#">友情链接</a><span>:</span></li>
					<li><a href="">青岛租车</a><span>|</span></li>
					<li><a href="">青岛汽车租赁</a><span>|</span></li>
					<li><a href="">青岛婚庆租车</a><span>|</span></li>
					<li><a href="">青岛包车</a></li>
				</ul>
			</div>
		</div>
	</div>
	<div class="biaodan">
		<ul class="top clearfix">
			<li class="active">在线订车</li>
			<li>车型分类</li>
		</ul>
		<div class="bottom">
			<ol>
				<li class="show">
					<div>
						<p>取车地点:
							<select class="xl1">
								<option>青岛市宁夏路89号</option>
								<option>青岛市宁夏路10号</option>
								<option>青岛市宁夏路22号</option>
								<option>青岛市宁夏路45号</option>
							</select>
						</p>
					</div>
					<div>
						<p>还车地点:
							<select class="xl1">
								<option>青岛市宁夏路11号</option>
								<option>青岛市宁夏路33号</option>
								<option>青岛市宁夏路66号</option>
								<option>青岛市宁夏路99号</option>
							</select>
						</p>
					</div>
					<div>
						<p>取车时间:
							<select class="xl2">
								<option>2014-08-11</option>
								<option>2014-08-13</option>
								<option>2014-08-15</option>
								<option>2014-08-19</option>
							</select>
							<select class="xl2">
								<option>13:00</option>
								<option>15:00</option>
								<option>19:00</option>
								<option>22:00</option>
							</select>
						</p>
					</div>
					<div>
						<p>还车时间:
							<select class="xl2">
								<option>2014-08-11</option>
								<option>2014-08-13</option>
								<option>2014-08-15</option>
								<option>2014-08-19</option>
							</select>
							<select class="xl2">
								<option>13:00</option>
								<option>15:00</option>
								<option>19:00</option>
								<option>22:00</option>
							</select>
						</p>
					</div>
				</li>
				<li>
					<div>
						<p>取车地点:
							<select class="xl1">
								<option>张家口市宁夏路89号</option>
								<option>张家口市宁夏路10号</option>
								<option>张家口市宁夏路22号</option>
								<option>张家口市宁夏路45号</option>
							</select>
						</p>
					</div>
					<div>
						<p>还车地点:
							<select class="xl1">
								<option>张家口市宁夏路11号</option>
								<option>青岛市宁夏路33号</option>
								<option>青岛市宁夏路66号</option>
								<option>青岛市宁夏路99号</option>
							</select>
						</p>
					</div>
					<div>
						<p>取车时间:
							<select class="xl2">
								<option>2014-08-11</option>
								<option>2014-08-13</option>
								<option>2014-08-15</option>
								<option>2014-08-19</option>
							</select>
							<select class="xl2">
								<option>13:00</option>
								<option>15:00</option>
								<option>19:00</option>
								<option>22:00</option>
							</select>
						</p>
					</div>
					<div>
						<p>还车时间:
							<select class="xl2">
								<option>2014-08-11</option>
								<option>2014-08-13</option>
								<option>2014-08-15</option>
								<option>2014-08-19</option>
							</select>
							<select class="xl2">
								<option>13:00</option>
								<option>15:00</option>
								<option>19:00</option>
								<option>22:00</option>
							</select>
						</p>
					</div>
				</li>
			</ol>
			<p class="p1">立即订车</p>
		</div>
	</div>
</div>
	
	<script >
		$('ul li').click(function(){
			$('ul li').removeClass('active')
			$(this).addClass('active')
			
			$('ol li').removeClass('show')
			$('ol li').eq($(this).index()).addClass('show')
		})
	</script>
</body>
</html>